<html xmlns="http://www.w3.org/1999/xhtml"
	xmlns:h="http://java.sun.com/jsf/html"
	xmlns:f="http://java.sun.com/jsf/core"
	xmlns:ui="http://java.sun.com/jsf/facelets"
	xmlns:r="http://ricchieri.com/facelets"
	xmlns:p="http://primefaces.org/ui">
<h:head>
</h:head>
<h:body>


	<ui:composition template="../../templates/commonLayoutReservation.xhtml">
		<ui:define name="title">#{msg.titleReservation}</ui:define>
		<ui:define name="content">
			<h:form id="tripStatus">
				<p:messages showDetail="false" autoUpdate="true" closable="false" severity="fatal"/> 
				<h2>#{msg.tripStatus}</h2> 
				<p:wizard widgetVar="wiz" showStepStatus="true" showNavBar="false" flowListener="#{travelStatusMB.onFlowProcess}">
					<p:tab id="calendar" title="#{msg.calendar}">
						<p:panel>
							<h:outputLabel value="#{msg.formTravelStatus}" style="text-align:center; width:20%; font-weight: bold"/>
							<p:panelGrid columns="2" style="margin-bottom:10px;text-align: center;width:30%;">
								<p:outputPanel>
									<span class="completeTravelDetails">Empty</span>
									<h:outputLabel value="#{msg.load}"/>
								</p:outputPanel>
								
								<p:outputPanel>
									<span class="notCompleteTravelDetails">Empty</span>
									<h:outputLabel value="#{msg.unload}"/>
								</p:outputPanel>
							</p:panelGrid>
	
							<h:panelGrid columns="2">
								<h:outputLabel value="#{msg.tripOrientation}" />
								<p:selectOneMenu value="#{travelStatusMB.scheduleCharterFilter.trip}">
									<f:selectItems value="#{travelStatusMB.trips}" />
									<p:ajax listener="#{travelStatusMB.changeTrip}" update="@form"/>
								</p:selectOneMenu>
							</h:panelGrid>
							<p:schedule id="schedule" value="#{travelStatusMB.scheduleLazyModel}" draggable="false" resizable="false" widgetVar="myschedule" style="padding-top:15px;" timeFormat="HH:mm">  
			       				<p:ajax event="eventSelect" listener="#{travelStatusMB.onEventSelect}" update="eventDetails" oncomplete="eventDialog.show()" /> 
							</p:schedule>				
							
							 <p:dialog widgetVar="eventDialog" header="#{msg.eventDetails}" showEffect="clip" hideEffect="clip" maximizable="false" minimizable="false" resizable="false">
						        <h:panelGrid id="eventDetails" columns="2">
										<h:outputLabel style="font-weight:bold" value="#{msg.scheduleDriver}"/>
										<h:outputLabel value="#{travelStatusMB.event.scheduleCharter.user.getFullName()}" />
										 					
									    <h:outputLabel style="font-weight:bold" value="#{msg.date}" />
							            <h:outputLabel value="#{travelStatusMB.formatDate(travelStatusMB.event.scheduleCharter.schedule.date)}" />
							            
							            <h:outputLabel style="font-weight:bold" value="#{msg.time}" />
							            <h:outputLabel value="#{travelStatusMB.event.scheduleCharter.schedule.time}" />
							
										<h:outputLabel style="font-weight:bold" value="#{msg.charterNumber}" />
										<h:outputLabel value="#{travelStatusMB.event.scheduleCharter.charter.charterNumber}" />  
							
										<h:outputLabel style="font-weight:bold" value="#{msg.charterType}"/>
										<h:outputLabel value="#{travelStatusMB.obtainDescription(travelStatusMB.event.scheduleCharter.charter.charterType.description)}" /> 
		
										<h:outputLabel style="font-weight:bold" value="#{msg.charterPlaces}"/>
										<h:outputLabel value="#{travelStatusMB.event.scheduleCharter.charter.places}" />  
										 
										<h:outputLabel style="font-weight:bold" value="#{msg.reservationsTotal}"/>
										<h:outputLabel value="#{travelStatusMB.event.scheduleCharter.quantityReserved}" />  
							
						        </h:panelGrid>
								<center>
									<p:commandButton value="#{msg.select}" update="@form" action="#{travelStatusMB.showTravelDetails(travelStatusMB.event)}" oncomplete="wiz.next();"/>
								</center>
						    </p:dialog>
						</p:panel>
							    
										
					</p:tab>
					
					<p:tab id="passengers" title="#{msg.pax}">
						<p:panel> 
						
							<h:panelGrid columns="2">
								<h:outputLabel style="font-weight:bold" value="#{msg.scheduleDriver}"/>
								<h:outputLabel value="#{travelStatusMB.scheduleCharter.user.getFullName()}" />
								
								<h:outputLabel style="font-weight:bold" value="#{msg.date}" />
					            <h:outputLabel value="#{travelStatusMB.formatDate(travelStatusMB.scheduleCharter.schedule.date)}" />
					            
					            <h:outputLabel style="font-weight:bold" value="#{msg.time}" />
					            <h:outputLabel value="#{travelStatusMB.scheduleCharter.schedule.time}" />
					            
					            <h:outputLabel style="font-weight:bold" value="#{msg.tripOrientation}" />
					            <h:outputLabel value="#{travelStatusMB.scheduleCharter.trip.getFormatTrip()}" />
					
								<h:outputLabel style="font-weight:bold" value="#{msg.charterNumber}" />
								<h:outputLabel value="#{travelStatusMB.scheduleCharter.charter.charterNumber}" />  
								
								<h:outputLabel style="font-weight:bold" value="#{msg.charterType}"/>
								<h:outputLabel value="#{travelStatusMB.obtainDescription(travelStatusMB.scheduleCharter.charter.charterType.description)}" /> 
					
								<h:outputLabel style="font-weight:bold" value="#{msg.charterPlaces}"/>
								<h:outputLabel value="#{travelStatusMB.scheduleCharter.charter.places}" />   
					
							</h:panelGrid>
							
							<br/>
							<h2>#{msg.pax}</h2>
							<p:dataTable var="reservation" value="#{travelStatusMB.scheduleCharter.getActiveReservations()}" 
					     	 		style="padding-top:15px" id="reservationTable" paginatorPosition="bottom" emptyMessage="#{msg.noRecordsFound}">
					 
					 		 		<p:column headerText="#{msg.full_name}" style="width:30%">  
						            	<h:outputText value="#{reservation.user.getFullName()}" />   
					        		</p:column> 
					 
					 				<p:column headerText="#{msg.documentType}" style="width:7%">  
						            	<h:outputText value="#{travelStatusMB.obtainDescription(reservation.user.documentType.description)}" />   
					        		</p:column> 
					        		
							        <p:column headerText="#{msg.documentNum}" style="width:20%">  
						            	<h:outputText value="#{reservation.user.dni}" />   
					        		</p:column> 
					        		
					        		<p:column headerText="#{msg.travelled}" style="width:5%">  
						        		<center>
						        			<p:selectBooleanCheckbox  value="#{reservation.travelStatus}" disabled="#{travelStatusMB.scheduleCharter.lastTravelUpdate != null}">  
									            <p:ajax update="reservationTable" listener="#{reservation.changeTravelStatus()}"/>  
									        </p:selectBooleanCheckbox >  
									    </center>
					        		</p:column>
					        		
					        		<p:column headerText="#{msg.paid}" style="width:5%">  
						        		<center>
						        			<p:selectBooleanCheckbox value="#{reservation.paymentStatus}" disabled="#{travelStatusMB.scheduleCharter.lastTravelUpdate != null}">  
									            <p:ajax update="reservationTable" listener="#{reservation.changePaymentStatus()}"/>  
									        </p:selectBooleanCheckbox>  
									    </center>
					        		</p:column>
					        		
					        		<p:column headerText="#{msg.meanPayment}" style="width:10%">  
						       	 		<p:selectOneMenu value="#{reservation.meanPaymentStatusId}" disabled="#{travelStatusMB.scheduleCharter.lastTravelUpdate != null}">
											<f:selectItems value="#{travelStatusMB.meanPayments}" />
											<p:ajax listener="#{travelStatusMB.changeMeanPayment(reservation)}" />
										</p:selectOneMenu>
					        		</p:column> 
							</p:dataTable>
						</p:panel>
						
						<div style="text-align:right; margin-top:10px">
							<div style="display: inline;">	
								<p:commandLink update="@form" onclick="wiz.back();" styleClass="ui-button ui-widget ui-state-default ui-corner-all ui-button-text-only button-action">
									<span class="ui-button-text ui-c"><i class="icon-arrow-left"></i><r:space/><r:space/>#{msg.previous}</span>
								</p:commandLink>
							</div>
							<div style="display: inline;">	
								<p:commandLink update="@form" onclick="wiz.next();" styleClass="ui-button ui-widget ui-state-default ui-corner-all ui-button-text-only button-action">
									<span class="ui-button-text ui-c">#{msg.next}<r:space/><r:space/><i class="icon-arrow-right"></i></span>
								</p:commandLink>
							</div>
						</div>
						
					</p:tab>
					
					<p:tab id="expenses" title="#{msg.charterExpenses}">
						<p:panel id="panelExpenses"> 
							<h:panelGrid columns="3">
								<h:outputLabel value="#{msg.charterExpenseType}"/>
						    	<p:selectOneMenu id="charterType" value="#{travelStatusMB.selectedScheduleCharterExpenseType}">
									<f:selectItems value="#{travelStatusMB.scheduleCharterExpenseType}" />
								</p:selectOneMenu>
								<p:message id="charterTypeMsg" for="charterType" display="icon"/>
								
								<h:outputLabel value="#{msg.charterExpenseAmount}" />
						    	<p:inputText id="charterExpenseAmount" maxlength="6" 
						    			onkeypress="return isDecimalNumberKey(event)"
						    			value="#{travelStatusMB.scheduleCharterExpense.amount}"/>
						    	<p:message id="charterExpenseAmountMsg" for="charterExpenseAmount" display="icon"/>
			     		
						    	<h:outputLabel value="#{msg.charterExpenseDescription}" />
								<p:inputTextarea rows="5" cols="50" id="obs" value="#{travelStatusMB.scheduleCharterExpense.description}" maxlength="100" autoResize="false"/>
								<p:message id="obsMsg" for="obs" display="icon"/>
							</h:panelGrid>
							
							<h:panelGrid columns="2" style="margin-top:10px; text-align:center">
								<p:commandButton id="reset" value="#{msg.resetButton}" type="reset" update="panelExpenses" partialSubmit="true" process="panelExpenses" action="#{travelStatusMB.resetExpense}"
									ajax="false" styleClass="button-action green" disabled="#{travelStatusMB.scheduleCharter.lastTravelUpdate != null}"/>
								<p:commandButton id="search" value="#{msg.addButton}"
									action="#{travelStatusMB.saveExpense}" update="panelExpenses" partialSubmit="true" process="panelExpenses" disabled="#{travelStatusMB.scheduleCharter.lastTravelUpdate != null}"
									styleClass="button-action green" />
							</h:panelGrid>
							
							<p:dataTable var="expenseT" value="#{travelStatusMB.expenses}" id="expensesTable" style="padding-top:15px"  emptyMessage="#{msg.noExistExpenses}">  	  
						        <p:column headerText="#{msg.charterExpenseType}" style="width:30%">  
					            	<h:outputText value="#{travelStatusMB.obtainDescription(expenseT.scheduleCharterExpenseType.description)}" />   
				        		</p:column>
				        		
				        		<p:column headerText="#{msg.charterExpenseAmount}" style="width:30%">  
					            	<h:outputText value="#{expenseT.amount}" />   
				        		</p:column>  
				        		
				        		<p:column headerText="#{msg.charterExpenseDescription}" style="width:30%" styleClass="truncate">  
					            	<h:outputText value="#{expenseT.description}" />   
				        		</p:column>  
				        		
				        		<p:column headerText="#{msg.actions}" style="width:30%">
				        			<center>
					        			<p:commandLink styleClass="ui-button ui-widget ui-state-default ui-corner-all ui-button-text-only button-action" style="font-size:14px" 
					        				actionListener="#{travelStatusMB.deleteExpense(expenseT)}" update="@form" process="@this" 
					        				disabled="#{travelStatusMB.scheduleCharter.lastTravelUpdate != null}">
											<span class="ui-button-text ui-c"><i class="icon-remove-sign"></i><r:space/><r:space/>#{msg.delete}</span>
										</p:commandLink>
									</center>
				        		</p:column>
						    </p:dataTable>
						
						</p:panel>

						<div style="text-align:right; margin-top:10px">
							<div style="display: inline;">	
								<p:commandLink update="@form" onclick="wiz.back();" styleClass="ui-button ui-widget ui-state-default ui-corner-all ui-button-text-only button-action">
									<span class="ui-button-text ui-c"><i class="icon-arrow-left"></i><r:space/><r:space/>#{msg.previous}</span>
								</p:commandLink>
							</div>
							<div style="display: inline;">	
								<p:commandLink update="@form" onclick="wiz.next();" styleClass="ui-button ui-widget ui-state-default ui-corner-all ui-button-text-only button-action">
									<span class="ui-button-text ui-c">#{msg.next}<r:space/><r:space/><i class="icon-arrow-right"></i></span>
								</p:commandLink>
							</div>
						</div>
					</p:tab>
					
					<p:tab id="confirmation" title="#{msg.confirmation}">
						<p:panel> 
							<r:viewTravelStatus travelStatusBean="#{travelStatusMB.travelStatusBean}"/>					
						</p:panel>
						<div style="text-align:right; margin-top:10px" >	
							<p:commandLink update="@form" onclick="wiz.back();" styleClass="ui-button ui-widget ui-state-default ui-corner-all ui-button-text-only button-action">
								<span class="ui-button-text ui-c"><i class="icon-arrow-left"></i><r:space/><r:space/>#{msg.previous}</span>
							</p:commandLink>
							
							<p:commandLink update="@form" styleClass="ui-button ui-widget ui-state-default ui-corner-all ui-button-text-only button-action" 
								action="#{travelStatusMB.saveTravelStatus}" disabled="#{travelStatusMB.scheduleCharter.lastTravelUpdate != null}">
								<span class="ui-button-text ui-c"><i class="icon-save"></i><r:space/><r:space/>#{msg.saveButton}</span>
							</p:commandLink>
						</div>
					</p:tab>
				</p:wizard>
			</h:form>
		
		</ui:define>
	</ui:composition>
</h:body>
</html>